<template>
  <div id="mainloginFrame">
    <div id="logincss">
      <h2 style="text-align: center">忘记密码请求</h2>
      <el-form ref="form" label-width="100px">
        <el-form-item label="用户名：">
          <el-input  placeholder="请输入你的用户名:" v-model="userId">
          </el-input>
        </el-form-item>
        <el-form-item label="自设提取码：">
          <el-input   type="password" placeholder="请输入你的提取码（请求结果用）:" v-model="checkcode">
          </el-input>
        </el-form-item>
        <el-row style="text-align: center">
          <el-button @click="returnlogin">返回</el-button>
          <el-button @click="findpassword">通知人事</el-button>
          <el-button @click="searchpasswordView">查询请求结果</el-button>
        </el-row>
        <el-row>
          <el-button @click="showEmailDialog = true">邮箱认证</el-button>
        </el-row>
      </el-form>
    </div>
    <el-dialog
      title="报 表 提 交"
      :visible.sync="showEmailDialog"
      width="30%"
      :before-close="handleClose">
      <el-row>
        <el-form ref="form" label-width="120px">
        <el-form-item label="输入你的UserId">
          <el-input v-model="userIds"></el-input>
        </el-form-item>
        <el-form-item label="输入你的邮箱">
          <el-input v-model="Email"></el-input>
        </el-form-item>
        </el-form>
      </el-row>
      <el-row>
        <el-button @click="sendEmailResetPassword">提交验证</el-button>
      </el-row>
    </el-dialog>

  </div>
</template>

<script>
    export default {
        name: "RequestFindPassword",
      data() {
        return {
          Email:"",
          userIds:"",
          userId: "",
          checkcode:"",
          requestOfType: "rebuildpassword",
          showEmailDialog:false,
        }
      },
      methods:{
        handleClose(done) {
          this.$confirm('确认关闭？')
            .then(_ => {
              this.showEmailDialog = false
              done();
            })
            .catch(_ => {


            });
        },

        sendEmailResetPassword()
        {
          this.$axios.post(("/resetPasswordByEmail"),{
            userId:this.userIds,
            email:this.Email
          }).then((res)=>{
            this.$message.success("重置成功，请查看邮箱！")
            this.$router.push({path:'/'})
          }).catch(()=>{
            this.$message.error("重置失败，账号和邮箱不一致！")
          })
        },






        returnlogin(){
          this.$router.push({path: '/'});
        },
        searchpasswordView()
        {
          this.$router.push({path:'/searchpasswordView'});
        },
        findpassword(){
          if(this.userId == ""||this.checkcode == "")
          {
            return this.$message.error("用户名或自设提取码为空")
          }
          this.$axios.post('/RequestFindPassword',
            {
              userId:this.userId,
              checkcode:this.checkcode
            }
          ).then((res)=>{
            if(res.data.msg == "nouser")
            {
              return this.$message.error("用户不存在，请重试");
            }
            if(res.data.msg == "samerequest")
            {
              return this.$message.error("用户已存在相同的请求或审核未通过，请重试");
            }
            if(res.data.msg == "success"&&res.status == 200)
            {

              return this.$message.success("重设密码请求发送成功，请等待管理员邮件通知!");
            }
          })
        }
      }
    }
</script>

<style scoped>
  #mainloginFrame{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #42b983;
  }
  #logincss{
    width: 350px;
    margin: 160px auto; /* 上下间距160px，左右自动居中*/
    background-color: rgb(255, 255, 255); /* 透明背景色 */
    padding: 30px;
    border-radius: 20px; /* 圆角 */
  }


  a:link {
    color: #330099;
    text-decoration: none;
  }
  a:visited {
    text-decoration: none;
  }
  a:hover {
    text-decoration: underline;
    color: #FF0000;
  }
  a:active {
    text-decoration: none;
  }
</style>
